<template>
	<view style="background-color: #1262DB;padding: 20rpx;min-height: 1500rpx;">
		<view class="contents" v-if="Object.keys(order_detail).length > 0">
			<view class="dis">
				<view class="">
					<image v-if="order_detail.status == 1" :src="url+icon.dzf" mode="" style="width: 50rpx;height:50rpx"></image>
					<image v-if="order_detail.status == 2" :src="url+icon.jcz" mode="" style="width: 50rpx;height:50rpx"></image>
					<image v-if="order_detail.status == 3" :src="url+icon.wc" mode="" style="width: 50rpx;height:50rpx"></image>
				</view>
				<view class="bigtext" style="margin-top: 5rpx;margin-left: 20rpx;">
					{{order_detail.status == 1 ? '待支付' : order_detail.status == 2 ? '检测中' : order_detail.status == 3 ? '已完成' : '已取消'}}
				</view>
			</view>
			<view class="" style="color: #838383;font-size: 28rpx;">
				单号：{{order_detail.order_id}}
			</view>
			<view class="xian"></view>
			<view class="dis disJuB disAl">
				<view class="dis" style="flex-direction: column;">
					<view class="" style="margin-top: 20rpx;">
						<span class="c">患者姓名：</span><span class="d">{{order_detail.username}}</span>
					</view>
					<view class="" style="margin-top: 20rpx;">
						<span class="c">患者性别：</span><span class="d">{{order_detail.gender == 1 ? '男' : '女'}}</span>
					</view>
					<view class="" style="margin-top: 20rpx;">
						<span class="c">患者年龄：</span><span class="d">{{order_detail.age}}岁</span>
					</view>
					<view class="" style="margin-top: 20rpx;">
						<span class="c">患者身高：</span><span class="d">{{hz.hz_height}}cm</span>
					</view>
					<view class="" style="margin-top: 20rpx;">
						<span class="c">患者体重：</span><span class="d">{{hz.hz_weight}}kg</span>
					</view>
				</view>
				<view class="">
					<image v-if="order_detail.status == 1" :src="url+icon.big_dzf" mode="" style="width: 193rpx;height: 170rpx;"></image>
					<image v-if="order_detail.status == 2" :src="url+icon.big_jcz" mode="" style="width: 193rpx;height: 150rpx;"></image>
					<image v-if="order_detail.status == 3" :src="url+icon.big_ywc" mode="" style="width: 193rpx;height: 190rpx;"></image>
				</view>
			</view>
			<view class="xian"></view>
			<view class="c">
				检测结果
			</view>
			
			<view class="">
				<view class="gg dis" style="justify-content: space-around;">
					<view class="g">项目名称</view>
					<view class="g">检测结果</view>
					<view class="g">单位</view>
					<view class="g">参考范围</view>
				</view>
				<view class="gg2 dis" style="justify-content: space-around;" v-for="(item,index) in order_son">
					<view class="gg2 dis" style="justify-content: space-around;width: 100%;" v-if="item.device_type < 3">
						<view class="g2">{{item.ssued}}</view>
						<view class="g2">{{item.status == 3 ? item.result_data : '等待中'}}</view>
						<view class="g2">{{item.units}}</view>
						<view class="g2">{{item.max_val}}</view>
					</view>
					<view class="gg2 dis" style="justify-content: space-around;width: 100%;flex-wrap: wrap;" v-if="item.device_type == 3">
						<view  class="gg2 dis" style="justify-content: space-around;width: 100%;" v-for="(its,ins) in item.result_data.medicalResultIndexMap">
							<view class="g2">{{its.medicalCode_text}}</view>
							<view class="g2" style="display: flex;align-items: center;justify-content: center;">
								<span>{{item.status == 3 ? its.result : '等待中'}}</span>
								<img :src="url+'/wechatimg/shang2.png'" alt="" style="width: 20rpx;height: 30rpx;margin-left: 5rpx;" v-if="its.upanddown == 1" />
								<img :src="url+'/wechatimg/xia2.png'" alt="" style="width: 20rpx;height: 30rpx;margin-left: 5rpx;" v-if="its.upanddown == 2" />
							</view>
							<view class="g2" style="display: flex;align-items: center;justify-content: center;">{{its.medicalUnits}}</view>
							<view class="g2" style="display: flex;align-items: center;justify-content: center;">{{its.medicalReference}}</view>
						</view>
					</view>
					<view class="gg2 dis" style="justify-content: space-around;width: 100%;flex-wrap: wrap;" v-if="item.device_type == 4">
						
						<view  class="gg2 dis" style="justify-content: space-around;width: 100%;" v-for="(its,ins) in item.result_data">
							<view class="g2">{{its.nameCn}}</view>
							<view class="g2" style="display: flex;align-items: center;justify-content: center;">
								<span>{{item.status == 3 ? its.value : '等待中'}}</span>
								<img :src="url+'/wechatimg/shang2.png'" alt="" style="width: 20rpx;height: 30rpx;margin-left: 5rpx;" v-if="its.upanddown == 1" />
								<img :src="url+'/wechatimg/xia2.png'" alt="" style="width: 20rpx;height: 30rpx;margin-left: 5rpx;" v-if="its.upanddown == 2" />
							</view>
							<view class="g2" style="display: flex;align-items: center;justify-content: center;">{{its.referenceLower}}</view>
							<view class="g2" style="display: flex;align-items: center;justify-content: center;">{{its.referenceUpper}}</view>
						</view>
					</view>
					<!-- lanbo -->
					<view class="" style="width: 100%;" v-if="item.device_type == 6 && item.status == 3">
						<view class="gg2 dis" style="justify-content: space-around;width: 100%;" v-for="(result_item,result_index) in item.result_data">
							<view class="g2">{{result_item.item}}</view>
							<view class="g2">{{result_item.value}}</view>
							<view class="g2">{{result_item.unit}}</view>
							<view class="g2"></view>
						</view>
					</view>
					<view class="" style="width: 100%;" v-if="item.device_type == 6 && item.status != 3">
						<view class="gg2 dis" style="justify-content: space-around;width: 100%;">
							<view class="g2">{{item.ssued}}</view>
							<view class="g2">等待中</view>
							<view class="g2">{{item.units}}</view>
							<view class="g2">{{item.min_val}}-{{item.max_val}}</view>
						</view>
					</view>
					
					<view class="gg2 dis" style="justify-content: space-around;width: 100%;" v-if="item.device_type == 7">
						<view class="g2">{{item.ssued}}</view>
						<view class="g2">{{item.status == 3 ? item.result_data : '等待中'}}</view>
						<view class="g2">{{item.units}}</view>
						<view class="g2">{{item.min_val}}-{{item.max_val}}</view>
					</view>
					<view class="gg2 dis" style="justify-content: space-around;width: 100%;" v-if="item.device_type == 8">
						<view class="g2">{{item.ssued}}</view>
						<view class="g2" v-if="item.status == 3">
							<view class="" v-for="(item8,index8) in item.result_data">
								<view class="">
									{{item8.assay_name}}:{{item8.test_res_value}}
								</view>
							</view>
						</view>
						<view class="g2" v-else>等待中</view>
						<view class="g2">{{item.units}}</view>
						<view class="g2">{{item.min_val}}-{{item.max_val}}</view>
					</view>
					<view class="gg2 dis" style="justify-content: space-around;width: 100%;" v-if="item.device_type == 9">
						<view class="g2">{{item.ssued}}</view>
						<view class="g2" v-if="item.status == 3">
							<view class="" v-for="(item9,index9) in item.result_data">
								<view class="">
									{{item9.result}}
								</view>
							</view>
						</view>
						<view class="g2" v-else>等待中</view>
						<view class="g2">{{item.units}}</view>
						<view class="g2">{{item.min_val}}-{{item.max_val}}</view>
					</view>
				</view>
			</view>
			<view class="bc">
				<view class="" style="font-size: 28rpx;">
					下单时间：{{order_detail.createtime}}
				</view>
				<view class="" style="font-size: 28rpx;">
					合计￥{{order_detail.pay_money}}
				</view>
			</view>
			<view class="d" v-if="order_detail.significance != ''">
				项目意义:
			</view>
			<view class="cont" v-if="order_detail.significance != ''">
				{{order_detail.significance}}
			</view>
			<view class="d" v-if="order_detail.result_unscramble != ''">
				结果解读:
			</view>
			<view class="cont" v-if="order_detail.result_unscramble != ''">
				{{order_detail.result_unscramble}}
			</view>
			<view class="" style="margin-bottom: 30px;font-size: 28rpx;margin-top: 40rpx;">
				<span style="color: red;">*</span>注意:此项检测结果仅对样本负责，故仅供参考。医生需要结合临床表现进行诊断。
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',
				url:this.global.url,
				icon:{
					dzf:'wechatimg/dzhifu.png',
					jcz:'wechatimg/jiance.png',
					wc:'wechatimg/oks.png',
					big_jcz:'wechatimg/jiancezhong.png',
					big_ywc:'wechatimg/yiwancheng.png',
					big_dzf:'wechatimg/daizhifu.png',
				},
				order_detail:{},
				order_son:[],
				hz:{}
			}
		},
		onLoad(option) {
			if(option.id){
				this.id = option.id
				this.get_data()
			}
		},
		methods: {
			get_data(){
				let that = this
				uni.showLoading({
					title:"加载中"
				})
				uni.request({
					url: that.global.url + 'api/order/order_detail',
					method: 'POST',
					header: {
						'token': uni.getStorageSync('hz_token')
					},
					data: {
						orderid: that.id
					},
					success(res) {
						let result = res.data
						console.log(result)
						if (result.code == 1) {
							// 存用户信息
							that.order_detail = result.data.order
							that.order_son = result.data.order_son
							that.hz = result.data.hz
						} else {
							uni.showToast({
								title: result.msg,
								icon: 'none'
							})
						}
					},
					complete() {
						uni.hideLoading()
					}
				})
			}
		}
	}
</script>

<style>
	.contents{
		
		margin: 0px auto;
		background-color: #fff;
		border-radius: 15rpx;
		padding: 20rpx;
		margin-bottom: 20rpx;
	}
	.bigtext{
		font-size: 32rpx;
		font-weight: bold;
	}
	.xian{
		border-bottom: 1px solid #eeeeee;
		width: 100%;
		margin-top: 10rpx;
		margin-bottom: 10rpx;
	}
	.c{
		font-size: 30rpx;
		color: #909090;
	}
	.d{
		font-size: 30rpx;
		font-weight: bold;
	}
	.gg{
		background-color: #1262DB;
		margin-top: 20rpx;
	}
	.gg2{
		/* background-color: #1262DB; */
	}
	.g{
		color: #fff;
		font-size: 28rpx;
		width: 25%;
		padding-top: 15rpx;
		padding-bottom: 15rpx;
		text-align: center;
		border: 1px solid #ccc;
	}
	.g2{
		color: #000;
		font-size: 28rpx;
		width: 25%;
		padding-top: 15rpx;
		padding-bottom: 15rpx;
		text-align: center;
		border: 1px solid #ccc;
	}
	.bc{
		background-color: #efefef;
		color: #a6a6a6;
		padding: 10rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-radius: 10rpx;
		margin-top: 20rpx;
		margin-bottom: 20rpx;
	}
	.cont{
		background: #f5f5f5;
		    padding: 20rpx;
		    margin-top: 20rpx;
		    border-radius: 15rpx;
		    margin-bottom: 20rpx;
		    box-shadow: -6px -1px 10px -1px #d4d4d4;
			font-size: 28rpx;
			line-height: 28px;
	}
</style>
